<template>
  <div>
    <ul>
      <!-- v-for 遍历对象: v-for="(值， 键名) in 对象名" :key="xxx" -->
      <li v-for="(value, key) in person" :key="value">
        {{ value }} - {{ key }}
      </li>
    </ul>

    <ul class="box">
      <!-- v-for 遍历数字: v-for=" 数字 in 数字" :key="xxx" -->
      <!-- 场景： 了解通常用来生成大量标签， 测试样式使用 -->
      <li v-for="item in 1000" :key="item">
        {{ item }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      person: {
        name: "张三",
        intro: "狂徒",
        gender: "男",
      },
    };
  },
};
</script>

<style>
.box {
  overflow: auto;
}
</style>
